function fnW(str) {
    var num;
    str >= 10 ? num = str : num = "0" + str;
    return num;
}

//中国地图开始
//var china_map =echarts.init(document.getElementById("china_map"),'macarons'); 
var china_map = echarts.init(document.getElementById("china_map"), 'infographic');
//var x_map=[];
//var china_map =echarts.init(document.getElementById("china_map"),'shine'); 


function randomData() {
    return Math.round(Math.random() * 500);
}

var mydata = [];

var option = {
    //backgroundColor: '#FFFFFF',

    title: {
        text: '各地区听歌人数',
        textStyle: {
            color: '#fff'
        },
        //subtext: '纯属虚构',
        x: 'center'
    },
    tooltip: {
        trigger: 'item'
    },
    visualMap: {
        show: false,
        x: 'left',
        y: 'bottom',
        //layoutCenter:['30%','30%'],
        splitList: [{
                start: 3000,
                end: 3050
            }, 
            {
                start: 2950,
                end: 3000
            },
            {
                start: 2900,
                end: 2950
            }, 
            {
                start: 2850,
                end: 2900
            },
            {
                start: 2800,
                end: 2850
            }, 
        ],
        color: ['#ff0', '#ffff00', '#0E94EB','#00CC00','#C71585']
    },
    series: [{
        name: '各地区听歌人数',
        type: 'map',
        mapType: 'china',
        roam: true,
        label: {
            normal: {
                show: false
            },
            emphasis: {
                show: false
            }
        },
        data: mydata
    }]
};
    //通过jQuery Ajax请求数据渲染数据项
    $.get("http://120.26.162.38:9000/province", function (data) {
        $.each(data, function (key, v) {
            let adata = { name: v.province, value: v.user_num};
            mydata.push(adata);

            //value.列名 提取某一列的数值
            //console.log(value.id + value.month);
        });
        china_map.setOption({
            series: [{
                data: mydata
            }]
        })
    });

        china_map.setOption(option);

//中国地图结束







//获取当前时间
var timer = setInterval(function () {
    var date = new Date();
    var year = date.getFullYear(); //当前年份
    var month = date.getMonth(); //当前月份
    var data = date.getDate(); //天
    var hours = date.getHours(); //小时
    var minute = date.getMinutes(); //分
    var second = date.getSeconds(); //秒
    var day = date.getDay(); //获取当前星期几 
    var ampm = hours < 12 ? 'am' : 'pm';
    $('#time').html(fnW(hours) + ":" + fnW(minute) + ":" + fnW(second));
    $('#date').html('<span>' + year + '/' + (month + 1) + '/' + data + '</span><span>' + ampm + '</span><span>周' + day + '</span>')

}, 1000)


//男女听歌占比，带边框效果的饼图
//var pie_fanzui =echarts.init(document.getElementById("pie_fanzui"),'macarons'); 
var pie_fanzui = echarts.init(document.getElementById("pie_fanzui"), 'infographic');
var x_people=[];
var s_people=[];
option = {
    title: {
        x: 'center'
    },
    tooltip: {
        trigger: 'item',
        formatter: "{a} <br/>{b} : {c} ({d}%)"
    },
    legend: {
        orient: 'vertical',
        left: 'left',
        data: x_people,
        textStyle: {
            color: '#fff'
        }
    },

    label: {
        normal: {
            textStyle: {
                color: 'red' // 改变标示文字的颜色
            }
        }
    },
    series: [{
        name: '男女听歌占比',
        type: 'pie',
        radius: '75%',
        center: ['50%', '50%'],
        data: s_people,
        itemStyle: {
            emphasis: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: 'rgba(0, 0, 0, 0.5)'
            }
        }

    }]
};
$.get ("http://120.26.162.38:9000/gender",function(data){
    $.each(data,function(k,v) {
        x_people.push(v.user_num);
        s_people_1={value:v.user_num,name:v.gender};
        s_people.push(s_people_1);
    });
    pie_fanzui.setOption({
        legend: {
            data: x_people
        },
        series: [{
            data: s_people,
        }]
    })
});


    pie_fanzui.setOption(option);
//----------------------男女听歌占比end---------------



//19-25岁听歌榜单TOP5，带边框效果的饼图
//var pie_age =echarts.init(document.getElementById("pie_age"),'macarons');
var pie_age = echarts.init(document.getElementById("pie_age"), 'infographic');
// var x_age = [];
// var s_age = [];
//var pie_age =echarts.init(document.getElementById("pie_age"),'shine');
// option = {
//     tooltip: {
//         trigger: 'item',
//         formatter: "{a} <br/>{b}: {c} ({d}%)"
//     },
//     legend: {
//         orient: 'vertical',
//         x: 'left',
//         data: x_age,
//         textStyle: {
//             color: '#fff'
//         }
//     },
//     series: [{
//         name: '违法犯罪人员年龄分布',
//         type: 'pie',
//         radius: ['30%', '55%'],
//         avoidLabelOverlap: false,
//         label: {
//             normal: {
//                 show: false,
//                 position: 'center'
//             },
//             emphasis: {
//                 show: true,
//                 textStyle: {
//                     fontSize: '20',
//                     fontWeight: 'bold'
//                 }
//             }
//         },
//         labelLine: {
//             normal: {
//                 show: false
//             }
//         },
//         data: s_age
//     }]
// };



option = {
    tooltip: {
        trigger: 'item',
        formatter: '{a} <br/>{b}: {c} ({d}%)'
    },
    legend: {
        orient: 'vertical',
        left: 10,
        // data: ['直接访问', '邮件营销', '联盟广告', '视频广告', '搜索引擎'],
        textStyle: {
            color: '#fff',
            fontSize: '11',
        }
    },
    series: [
        {
            name: '喜爱榜单TOP5',
            type: 'pie',
            radius: ['40%', '60%'],
            center: ['65%', '50%'],
            avoidLabelOverlap: false,
            label: {
                show: false,
                position: 'center'
            },
            //点击时会有data数据的效果提示
            // emphasis: {
            //     label: {
            //         show: true,
            //         fontSize: '20',
            //         fontWeight: 'bold'
            //     }
            // },

            //会有一个边框效果（可要可不要）
            labelLine: {
                show: false
            },
            data: [
                {value: 167, name: '张信哲-爱你的宿命'},
                {value: 111, name: '筷子兄弟-老男孩猛龙过江'},
                {value: 100, name: '筷子兄弟-小苹果'},
                {value: 46, name: 'Z酷校园行-郑州大学'},
                {value: 36, name: '王蓉-小鸡小鸡'}
            ]
        }
    ]
};


// //通过jQuery Ajax请求数据渲染数据项
// $.get("http://localhost:9000/age_count", function (data) {
//     $.each(data, function (key, v) {
//         x_age.push(v.music_name);
//         s_age_1 = {value:v.music_name,name:v.music_num};
//         s_age.push(s_age_1);
//         //value.列名 提取某一列的数值
//         //console.log(value.id + value.month);

//     });

//     pie_age.setOption({
//         legend: {
//             data: x_age
//         },
//         series: [{
//             data: s_age
//         }]
//     });
// }) //重新渲染option



pie_age.setOption(option);
//
//
// function loadcloudwords(){
//     var wordcloud = echarts.init(document.getElementById('wordcloud'),'macarons');
//         var a_data=[];
//         var option = {
//         series: [{
//             type: 'wordCloud',
//             sizeRange: [15, 45],
//             rotationRange: [0, 0],
//             rotationStep: 45,
//             gridSize: 8,
//             shape: 'pentagon',
//             width: '100%',
//             height: '100%',
//             textStyle: {
//                 normal: {
//                     color: function () {
//                         return 'rgb(' + [
//                             Math.round(Math.random() * 160),
//                             Math.round(Math.random() * 160),
//                             Math.round(Math.random() * 160)
//                         ].join(',') + ')';
//                     }
//                 }
//             },
//             data:a_data
//         }]
//     };
    // $.get("http://120.26.162.38:9000/age_count", function (data) {
    //         $.each(data, function (k, v) {
    //             let adata = { value: v.music_name, name: v.music_num};
    //             a_data.push(adata);
    //         });
    //         wordcloud.setOption({
    //
    //             series: [
    //             {
    //
    //                 data: a_data
    //
    //             }
    //             ]
    //         })
    //     });
    //     wordcloud.setOption(option);
    // }
    // loadcloudwords();
//----------------------19-25岁听歌榜单TOP5end---------------



//===================各个年龄段听歌人数=======================
//var line_time =echarts.init(document.getElementById("line_time"),'shine'); 
var line_time = echarts.init(document.getElementById("line_time"), 'macarons');
var x_time=[];
var s_time=[];
//var line_time =echarts.init(document.getElementById("line_time"),'infographic'); 
var option = {
    // 给echarts图设置背景色
    //backgroundColor: '#FBFBFB',  // -----------> // 给echarts图设置背景色
    color: ['#7FFF00'],
    tooltip: {
        trigger: 'axis'
    },

    grid: {
        x: 60,
        y: 30,
        x2: 5,
        y2: 20

    },
    calculable: true,


    xAxis: [{
        type: 'category',
        data: x_time,
        axisLabel: {
            color: "#7FFF00" //刻度线标签颜色
        }
    }],
    yAxis: [{

        type: 'value',
        axisLabel: {
            color: "#7FFF00" //刻度线标签颜色
        }
    }],
    series: [{
        name: '各个年龄段听歌人数',
        type: 'line',
        data: s_time,

    }]
};
$.get ("http://120.26.162.38:9000/age_range",function(data){
    $.each(data,function(k,v) {
        x_time.push(v.age_range);
        s_time.push(v.user_num);

    });

    line_time.setOption({
        xAxis: [{
            data: x_time,
        }],
        series: [{
            data: s_time,
    
        }]
    })
});


line_time.setOption(option);


//=========听众喜爱榜TOP10=======================
//var qufenbu_data =echarts.init(document.getElementById("qufenbu_data"),'shine'); 
//var qufenbu_data =echarts.init(document.getElementById("qufenbu_data"),'macarons'); 
var qufenbu_data = echarts.init(document.getElementById("qufenbu_data"), 'infographic');
var x_city=[];
var s_city=[];
option = {
    color: ['#FADB71'],
    tooltip: {
        trigger: 'axis',
        axisPointer: { // 坐标轴指示器，坐标轴触发有效
            type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
        }
    },
    grid: {
        x: 40,
        y: 10,
        x2: 15,
        y2: 8
    },
    xAxis: [{
        type: 'category',
        data: x_city,
        axisTick: {
            alignWithLabel: true
        },
        axisLabel: {
            color: "#FADB71" //刻度线标签颜色
        }
    }],
    yAxis: [{
        type: 'value',
        axisLabel: {
            color: "#FADB71" //刻度线标签颜色
        }
    }],
    series: [{
        name: '听众喜爱榜TOP10',
        type: 'bar',
        barWidth: '70%',
        data: s_city
    }]
};
// $.get ("http://127.0.0.1:8080/crime/GetCities",function(data){
// $.each(data,function(k,v) {
//     x_city.push(v.city)
//     //s_city_1={value:v.v,name:v.city};
//     s_city.push(v.data);
// });
// qufenbu_data.setOption({
//     xAxis: [{
//         data: x_city,
//     }],
//     series: [{
//         data: s_city
//     }]
// });
$.get ("http://120.26.162.38:9000/top",function(data){
    $.each(data,function(k,v) {
    x_city.push(v.music_name)
    s_city_1={value:v.user_num,name:v.music_name};
    s_city.push(s_city_1);

    });
    qufenbu_data.setOption({
        xAxis: [{
            data: x_city
        }],
        series: [{
            data: s_city
        }]        
    })   
});

qufenbu_data.setOption(option);
//=========听众喜爱榜TOP10=======================


//时间选择器
var startV = '';
var endV = '';
laydate.skin('danlan');
var startTime = {
    elem: '#startTime',
    format: 'YYYY-MM-DD',
    min: '1997-01-01', //设定最小日期为当前日期
    max: laydate.now(), //最大日期
    istime: true,
    istoday: true,
    fixed: false,
    choose: function (datas) {
        startV = datas;
        endTime.min = datas; //开始日选好后，重置结束日的最小日期
    }
};
var endTime = {
    elem: '#endTime',
    format: 'YYYY-MM-DD',
    min: laydate.now(),
    max: laydate.now(),
    istime: true,
    istoday: true,
    fixed: false,
    choose: function (datas) {
        //        startTime.max = datas; //结束日选好后，重置开始日的最大日期
        endV = datas;
    }
};

laydate(startTime);
laydate(endTime);

//时间选择器
var startVs = '';
var endVs = '';
laydate.skin('danlan');
var startTimes = {
    elem: '#startTimes',
    format: 'YYYY-MM-DD',
    min: '1997-01-01', //设定最小日期为当前日期
    max: '2099-06-16', //最大日期
    istime: true,
    istoday: true,
    fixed: false,
    choose: function (datas) {
        startVs = datas;
        endTimes.min = datas; //开始日选好后，重置结束日的最小日期
        setQgData($('#barTypes').parent().parent(), 1);
    }
};
var endTimes = {
    elem: '#endTimes',
    format: 'YYYY-MM-DD',
    min: laydate.now(),
    max: laydate.now(),
    istime: true,
    istoday: true,
    fixed: false,
    choose: function (datas) {
        //        startTime.max = datas; //结束日选好后，重置开始日的最大日期
        endVs = datas;
        setQgData($('#barTypes').parent().parent(), 1);
    }
};

laydate(startTimes);
laydate(endTimes);




//更改日期插件的样式
function dateCss() {
    var arr = $('#laydate_box').attr('style').split(';');
    var cssStr =
        'position:absolute;right:0;';
    for (var i = 0; i < arr.length; i++) {
        if (arr[i].indexOf('top') != -1) {
            cssStr += arr[i];
        }
    }

    $('#laydate_box').attr('style', cssStr);
}


var workDate;
var time = {
    elem: '#times',
    format: 'YYYY-MM-DD',
    min: laydate.now(),
    max: laydate.now() + 30,
    istime: true,
    istoday: true,
    fixed: false,
    choose: function (datas) {
        //        startTime.max = datas; //结束日选好后，重置开始日的最大日期
        workDate = datas;
    }
};

laydate(time);